<template>
  <!--员工详请-->
  <div>
    <list :vipRecord="vipRecord"></list>
    <ul class="other">
      <li>上次审核时间：{{vipRecord.checkDate}}</li>
      <li v-if="vipRecord.checkRemark!=''">未通过说明</li>
      <li>{{vipRecord.checkRemark}}</li>
    </ul>
    <p class="offer" v-if="vipRecord.isCheck==3 || vipRecord.isCheck==1" @click="goUpdate(vipRecord)">修改并提交</p>
    <p class="offer disabled" v-if="vipRecord.isCheck==2" @click="goBack()">修改并提交</p>
  </div>
</template>

<script type="text/ecmascript-6">
  import list from '../../template/addhuiyuan'
  import {employeeViprecordDetail} from '../../../../test/unit/http'

  export default {
    name: '',
    props: {},
    data() {
      return {
        vipRecord: {}
      };
    },
    methods: {
      goBack() {
        this.$router.go(-1)
      },
      goUpdate(vipRecord) {
        this.$router.push({path: 'addhuiyuan', query: {type: 2, vipRecordId: vipRecord.vipRecordId}})
      }
    },
    created() {
      var vipRecordId = this.$route.query.vipRecordId;
      employeeViprecordDetail({vipRecordId: vipRecordId}).then(res => {
        console.log(res);
        if (res.code == 100) {
          this.vipRecord = res.object;
        }
      })


    },
    components: {
      list
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less" rel="stylesheet/less">
  .other {
    color: #999;
    text-align: left;
    padding: 15px 15px 60px;

    li {
      margin-bottom: 10px;
    }
    li:nth-child(2) {
      color: #111;
      font-size: 15px;
    }
  }

  .offer {
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: #f98e3c;
    height: 50px;
    line-height: 50px;
    color: #fff;
    z-index: 999;
  }

  .disabled {
    background-color: #bbb;
  }
</style>
